<template>
    <Card>
        <Form ref="myForm" :rules="ruleValidate" :model="formItem" :label-width="140" class="house-form">
                <FormItem label="类型" prop="post_type">
                    <Select v-model="formItem.post_type">
                        <Option  :value=1 :key=1>厂房</Option>
                        <Option  :value=2 :key=2>住房</Option>
                        <Option  :value=3 :key=3>写字楼</Option>
                        <Option  :value=4 :key=4>商铺</Option>
                    </Select>
                </FormItem>
                <FormItem label="(楼盘/商铺/大厦)名称" prop="name">
                    <Input v-model="formItem.name" placeholder="请输入标题"></Input>
                </FormItem>
                
                <FormItem label="城市" prop="city">
                    <al-cascader v-model="formItem.city" level="3" @on-change="selected"/>
                </FormItem>
                <FormItem label="所在详细地址" class="lists" prop="street">
                    <Input v-model="formItem.street" @on-change="remoteMethod" @on-focus="changeList(true)" @on-blur="changeList(false)" class="in" placeholder="房屋所在区域街道" style="position:realtive">
                      
                    </Input>
                    <!-- <ul :v-for="item in streets" style="position:absolute">
                        <li>{{item.address}}</li>
                      </ul> -->
                      <ul class="list" v-bind:class="{ 'showList':listShow }">
                          <li v-for="item in streets" @click="changeItem(item)">
                              {{ item.address }}
                              <span class="append">
                                {{item.district}}
                              </span>
                          </li>
                      </ul> 
                    <!-- <Select
                        v-model="formItem.street"
                        filterable
                        remote
                        :remote-method="remoteMethod"
                        :loading="streetLoading">
                        <Option v-for="(option, index) in streets" :value="option.value" :key="index" >{{option.address}}</Option>
                    </Select> -->
                </FormItem>
                <FormItem label="选择位置" prop="street">
                    <div style="width:100%; height:300px">
                      <el-amap :vid="'amap-vue'" :center="center" :zoom="15" :amap-manager="amapManager" :events="events">
                        <el-amap-marker :position="marker.position" :events="marker.events" :visible="marker.visible" :draggable="true"></el-amap-marker>
                      </el-amap>
                    </div>
                </FormItem>
                <FormItem label="首页推荐房源" prop="recommend">
                    <!-- <RadioGroup v-model="formItem.recommend">
                        <Radio label='1' ><span>推荐</span></Radio>
                        <Radio label='2' ><span>不推荐</span></Radio>
                    </RadioGroup> -->
                    <Checkbox v-model="formItem.recommend" true-value="1" false-value="2">推荐</Checkbox>
                </FormItem>
                <FormItem label="出租面积" prop="area">
                    <Input v-model="formItem.area" number @keyup.native="provingarea" placeholder="请输入房源面积，单位m*m"></Input>
                </FormItem>
                <FormItem label="月租金" prop="price">
                    <Input v-model="formItem.price" number @keyup.native="provingprice" placeholder="请输入租金价格"></Input>
                </FormItem>
                <!-- <FormItem label="周租金" prop="week">
                    <Input v-model="week" placeholder="请输入租金价格"></Input>
                </FormItem> -->
                <template v-if="this.formItem.post_type == 2">
                <FormItem label="房型" prop="type_id">
                    <!-- <Select v-model="formItem.type_id">
                        <Option v-for="item in houseType" :value="item.id" :key="item.id">{{ item.title }}</Option>
                    </Select> -->
                    <Col span="6">
                        <Input v-model="formItem.type.attr1" number @keyup.native="proving1"><span slot="append">室</span></Input>
                    </Col>
                    <Col span="6">
                        <Input v-model="formItem.type.attr2" number @keyup.native="proving2"><span slot="append">厅</span></Input>
                    </Col>
                    <Col span="6">
                        <Input v-model="formItem.type.attr3" number @keyup.native="proving3"><span slot="append">卫</span></Input>
                    </Col>
                    <Col span="6">
                        <Input v-model="formItem.type.attr4" number @keyup.native="proving4"><span slot="append">厨</span></Input>
                    </Col>
                </FormItem>
                </template>
                <template v-if="this.formItem.post_type == 2">
                  <FormItem label="租赁方式" prop="rent_type">
                      <Select v-model="formItem.rent_type">
                          <Option  :value=1 :key=1>整租</Option>
                          <Option  :value=2 :key=2>合租</Option>
                          <Option  :value=3 :key=3>短租</Option>
                      </Select>
                  </FormItem>
                </template>
                <template v-if="this.formItem.post_type !== 1">
                <FormItem label="装修情况" prop="finish">
                    <Select v-model="formItem.finish">
                        <Option  :value=1 :key=1>毛坯房</Option>
                        <Option  :value=2 :key=2>简单装修</Option>
                        <Option  :value=3 :key=3>精装修</Option>
                        <Option  :value=4 :key=4>豪华装修</Option>
                    </Select>
                </FormItem>
                </template>
                <template v-if="this.formItem.post_type == 2">
                  <FormItem label="房间朝向" prop="orientation">
                    <Select v-model="formItem.orientation">
                          <Option  :value=1 :key=1>东</Option>
                          <Option  :value=2 :key=2>南</Option>
                          <Option  :value=3 :key=3>西</Option>
                          <Option  :value=4 :key=4>北</Option>
                          <Option  :value=6 :key=6>东北</Option>
                          <Option  :value=5 :key=5>东南</Option>
                          <Option  :value=8 :key=8>西北</Option>
                          <Option  :value=7 :key=7>西南</Option>
                      </Select>
                  </FormItem>
                </template>
                <FormItem label="楼层">
                  <Row>
                    <Col span="8">
                        <Input v-model="formItem.floor" number @keyup.native="provingfloor"><span slot="append">层</span></Input>
                    </Col>
                    <Col span="15" offset="1">
                        <Input v-model="formItem.floors" number @keyup.native="provingfloors"><span slot="prepend">共</span><span slot="append">层</span></Input>
                    </Col>
                  </Row>
                </FormItem>
                <template v-if="this.formItem.post_type == 2">
                  <FormItem label="建造年代" prop="time">
                    <Input v-model="formItem.time"></Input>
                  </FormItem>
                </template>
                <template v-if="this.formItem.post_type == 2">
                  <FormItem label="租房限制" prop="restrict">
                  <Select v-model="formItem.restrict">
                        <Option  :value=1 :key=1>不限男女</Option>
                        <Option  :value=2 :key=2>不住男生</Option>
                        <Option  :value=3 :key=3>不住女生</Option>
                        <Option  :value=4 :key=4>不养宠物</Option>
                    </Select>
                    </FormItem>
                </template>
                <template v-if="this.formItem.post_type == 2">
                  <FormItem label="房源配置" prop="allocation">
                  <CheckboxGroup v-model="formItem.allocation">
                        <Checkbox v-for="allocation in allocation1" :key="allocation.id" :label="allocation.id + ''">{{ allocation.name }}</Checkbox>
                    </CheckboxGroup>
                    </FormItem>
                </template>
                <template v-if="this.formItem.post_type == 3 || this.formItem.post_type==4">
                  <FormItem label="房源配置" prop="allocation">
                  <CheckboxGroup v-model="formItem.allocation">
                        <Checkbox v-for="allocation in allocation2" :key="allocation.id" :label="allocation.id + ''">{{ allocation.name }}</Checkbox>
                    </CheckboxGroup>
                    </FormItem>
                </template>
                <FormItem label="联系人" prop="contact">
                    <Input v-model="formItem.contact" placeholder="请输入联系人"></Input>
                </FormItem>
                <FormItem label="联系方式" prop="phone">
                    <Input v-model="formItem.phone" :maxlength="11" placeholder="请输入电话号码"></Input>
                </FormItem>
                <FormItem label="室内图" prop="imgs">
                  <div class="demo-upload-list" v-for="(item,index) in imgsList" v-bind:key="index">
                      <template>
                          <img :src="item.url">
                          <div class="demo-upload-list-cover">
                              <Icon type="ios-eye-outline" @click.native="handleView(item.url)"></Icon>
                              <Icon type="trash-a" @click.native="handleRemoveImgs(index)"></Icon>
                              <!-- <Icon type="ios-trash-outline" @click.native="handleRemove(item)"></Icon> -->
                          </div>
                      </template>
                      <!-- <template v-else>
                          <Progress v-if="item.showProgress" :percent="item.percentage" hide-info></Progress>
                      </template> -->
                  </div>
                  <Upload
                      ref="upload"
                      :show-upload-list="false"
                      :default-file-list="defaultList"
                      :on-success="handleSuccess"
                      :format="['jpg','jpeg','png']"
                      :max-size="2048"
                      :on-format-error="handleFormatError"
                      :on-exceeded-size="handleMaxSize"
                      :before-upload="handleBeforeUpload"
                      :data="{token}"
                      multiple
                      type="drag"
                      action="https://api.fanzu.vip/api/v1/upload?style=1"
                      style="display: inline-block;width:58px;">
                      <div style="width: 58px;height:58px;line-height: 58px;">
                          <Icon type="camera" size="20"></Icon>
                      </div>
                  </Upload>
                  
                </FormItem>
                <template v-if="this.formItem.post_type == 2">
                  <FormItem label="户型图" prop="model">
                    <div class="demo-upload-list" v-for="(item,index) in modelList" v-bind:key="index">
                        <template>
                            <img :src="item.url">
                            <div class="demo-upload-list-cover">
                                <Icon type="ios-eye-outline" @click.native="handleView(item.url)"></Icon>
                                <Icon type="trash-a" @click.native="handleRemoveModel(index)"></Icon>
                            </div>
                        </template>
                    </div>
                    <Upload
                        ref="upload"
                        :show-upload-list="false"
                        :on-success="handleModelSuccess"
                        :format="['jpg','jpeg','png']"
                        :max-size="2048"
                        :on-format-error="handleFormatError"
                        :on-exceeded-size="handleMaxSize"
                        type="drag"
                        action="https://api.fanzu.vip/api/v1/upload?style=1"
                        style="display: inline-block;width:58px;">
                        <div style="width: 58px;height:58px;line-height: 58px;">
                            <Icon type="camera" size="20"></Icon>
                        </div>
                    </Upload>
                    
                  </FormItem>
                  <FormItem label="小区图" prop="community">
                    <div class="demo-upload-list" v-for="(item,index) in communityList" v-bind:key="index">
                        <template>
                            <img :src="item.url">
                            <div class="demo-upload-list-cover">
                                <Icon type="ios-eye-outline" @click.native="handleView(item.url)"></Icon>
                                <Icon type="trash-a" @click.native="handleRemoveCommunity(index)"></Icon>
                            </div>
                        </template>
                    </div>
                    <Upload
                        ref="upload"
                        :show-upload-list="false"
                        :on-success="handlecommunitySuccess"
                        :format="['jpg','jpeg','png']"
                        :max-size="2048"
                        :on-format-error="handleFormatError"
                        :on-exceeded-size="handleMaxSize"
                        type="drag"
                        action="https://api.fanzu.vip/api/v1/upload?style=1"
                        style="display: inline-block;width:58px;">
                        <div style="width: 58px;height:58px;line-height: 58px;">
                            <Icon type="camera" size="20"></Icon>
                        </div>
                    </Upload>
                    
                  </FormItem>
                </template>
                <FormItem label="封面图" prop="cover">
                    <Upload
                        action = "https://api.fanzu.vip/api/v1/upload?style=1"
                        :show-upload-list = "false"
                        type ="drag"
                        :format = "['jpg','jpeg','png']"
                        :on-success = "success">
                        <template v-if="this.formItem.cover !== ''">
                          <div style="width: 58px;height:58px;line-height: 58px;">
                            <img :src="this.formItem.cover" style="height:100%">
                          </div>
                        </template>
                        <template v-else>
                            <div style="width: 58px;height:58px;line-height: 58px;">
                                <Icon type="camera" size="20"></Icon>
                            </div>
                        </template>
                    </Upload>
                </FormItem>
                <FormItem label="房源标题" prop="title">
                    <Input v-model="formItem.title" placeholder="标题" :maxlength="24"></Input>
                </FormItem>
                <FormItem label="房屋描述" prop="remark">
                    <Input v-model="formItem.remark" type="textarea" :autosize="{minRows: 2,maxRows: 5}" placeholder="备注"></Input>
                </FormItem>
                <FormItem>
                  <Button type="primary" @click="submit" :loading="addLoading">确认添加</Button>
                </FormItem>
                <Modal title="View Image" v-model="visibleImg" z-index="999" style="z-index:99899;" :transfer=false>
                      <img :src=" img " v-if="visibleImg" style="width: 100%">
                  </Modal>
            </Form>
    </Card>
</template>

<style lang="less" scoped>
.demo-upload-list {
  display: inline-block;
  width: 60px;
  height: 60px;
  text-align: center;
  line-height: 60px;
  border: 1px solid transparent;
  border-radius: 4px;
  overflow: hidden;
  background: #fff;
  position: relative;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
  margin-right: 4px;
}
.demo-upload-list img {
  width: 100%;
  height: 100%;
}
.demo-upload-list-cover {
  display: none;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.6);
}
.demo-upload-list:hover .demo-upload-list-cover {
  display: block;
}
.demo-upload-list-cover i {
  color: #fff;
  font-size: 20px;
  cursor: pointer;
  margin: 0 2px;
}
.lists {
  position: relative;
  ul {
    position: absolute;
    border: #cccccc 1px solid;
    display: none;
    z-index: 999;
    background-color: #fff;
    width: 100%;
    // box-shadow:#cacaca 20px 0px;
    li {
      list-style: none;
      padding-left: 5px;
      margin: 5px 0 0 0;
      border-bottom: #cacaca 1px dotted;
      cursor: pointer;
      .append {
        float: right;
        margin-right: 5px;
        color: #cacaca;
      }
    }
  }
  .showList {
    display: block;
  }
}
.house-form{
  width: 45%;
  margin: 0 auto;
}
</style>

<script>
const resourse = "house";

import axios from "axios";
import VueAMap from "vue-amap";
import { lazyAMapApiLoaderInstance } from 'vue-amap';
export default {
  data() {
     var  validatephone= function(rule, value, callback){
        let reg =/(^(\d{3,4}-)?\d{7,8})$|(^1[0-9]{10}$)/;
       let partten=reg.test(value);
       if(value&&!partten){
             callback(new Error("请输入正确联系方式"));
        }else{
            callback();
        }
     };
    return {
      addLoading:false,
      streets: [],
      streetLoading: false,
      formItem: {
        id: 0,
        area: "",
        contact: "",
        finish: 0,
        title: "",
        orientation: 0,
        phone: "",
        price: 0,
        rent_type: 0,
        street: "",
        type: {
          attr1:0,
          attr2:0,
          attr3:0,
          attr4:0
        },
        imgs: [],
        city: [],
        cover: "",
        post_type: 0,
        allocation: [],
        floors: 0,
        floor: 0,
        week:0,
        recommend:0
      },
      res: [],
      types: [],
      token: "",
      defaultList: [],
      imgName: "",
      visibleImg: false,
      uploadList: [],
      houseType: [],
      imgsList: [],
      //户型图
      modelList: [],
      //小区图
      communityList: [],
      allocation1: [
        {
          id: 1,
          name: "阳台"
        },
        {
          id: 2,
          name: "热水器"
        },
        {
          id: 3,
          name: "空调"
        },
        {
          id: 4,
          name: "冰箱"
        },
        {
          id: 5,
          name: "电视"
        },
        {
          id: 6,
          name: "衣柜"
        },
        {
          id: 7,
          name: "网络"
        },
        {
          id: 8,
          name: "厨房"
        },
        {
          id: 9,
          name: "独立卫生间"
        },
        // {
        //   id: 10,
        //   name: "热水器"
        // },
        {
          id: 11,
          name: "床"
        },
        {
          id: 12,
          name: "试衣镜"
        },
        {
          id: 13,
          name: "书桌"
        },
        {
          id: 14,
          name: "飘窗"
        },
        {
          id: 15,
          name: "洗衣机"
        },
        {
          id: 25,
          name: "油烟机"
        },
        {
          id: 26,
          name: "沙发"
        }
      ],
      allocation2: [
        {
          id: 16,
          name: "客梯"
        },
        {
          id: 17,
          name: "货梯"
        },
        {
          id: 18,
          name: "扶梯"
        },
        {
          id: 19,
          name: "暖气"
        },
        {
          id: 20,
          name: "停车位"
        },
        {
          id: 21,
          name: "水"
        },
        {
          id: 22,
          name: "燃气"
        },
        {
          id: 23,
          name: "网络"
        },
        {
          id: 24,
          name: "办公家具"
        }
      ],
      events: {
        init: () => {
          // this.geo = geo
        },
        click: e => {
          this.marker.position = [e.lnglat.lng, e.lnglat.lat];
        }
      },
      marker: {
        position: [121.5273285, 31.21515044],
        events: {
          dragend: e => {
            this.marker.position = [e.lnglat.lng, e.lnglat.lat];
          }
        },
        visible: true
      },
      position: [121.59996, 31.197646],
      center: [121.59996, 31.197646],
      ruleValidate: {
        street:[
          {required:true,message:'请选择街道',trigger: 'blur'},
          {type:'string',max:16,message:"最大长度16个字符",trigger:'blur'}
        ],
        name:[
          {required:true,message:'请输入名称',trigger:'blur'},
          {type:'string',max:16,message:"最大长度16个字符",trigger:'blur'}
        ],
        phone:[
          {validator:validatephone,trigger: 'blur'},
        ],
        area:[
          {required:true,message:'请输入面积',trigger:'blur'},
          // {type:'number',message:"请输入数字",trigger:'blur'}
        ],
      },
      listShow: false
    };
  },
  created () {
    lazyAMapApiLoaderInstance.load().then(() => {
      this.inputtips = new AMap.Autocomplete();
      this.amapManager = new VueAMap.AMapManager();
    })
  },
  mounted() {
    // axios.get("house/type").then(response => {
    //   let res = response.data;
    //   if (res.code == 200) {
    //     this.houseType = res.data.list;
    //   } else {
    //     if (res.code === 403) {
    //     } else {
    //       this.$Message.error(res.msg);
    //     }
    //   }
    // });
  },
  computed:{
    week:function(){
      return Math.ceil(this.formItem.price/4)
    }
  },
  methods: {
    proving1(){
      console.log(this.formItem.type.attr1);
        this.formItem.type.attr1=this.formItem.type.attr1.toString().replace(/[^\.\d]/g,'');
        this.formItem.type.attr1=this.formItem.type.attr1.toString().replace('.','');
      },
      proving2(){
        this.formItem.type.attr2=this.formItem.type.attr2.toString().replace(/[^\.\d]/g,'');
        this.formItem.type.attr2=this.formItem.type.attr2.toString().replace('.','');
      },
      proving3(){
        this.formItem.type.attr3=this.formItem.type.attr3.toString().replace(/[^\.\d]/g,'');
        this.formItem.type.attr3=this.formItem.type.attr3.toString().replace('.','');
      },
      proving4(){
        this.formItem.type.attr4=this.formItem.type.attr4.toString().replace(/[^\.\d]/g,'');
        this.formItem.type.attr4=this.formItem.type.attr4.toString().replace('.','');
      },
      provingfloor(){
        this.formItem.floor=this.formItem.floor.toString().replace(/[^\.\d]/g,'');
        this.formItem.floor=this.formItem.floor.toString().replace('.','');
      },
      provingfloors(){
        this.formItem.floors=this.formItem.floors.toString().replace(/[^\.\d]/g,'');
        this.formItem.floors=this.formItem.floors.toString().replace('.','');
      },
      provingarea(){
        this.formItem.area=this.formItem.area.toString().replace(/[^\.\d]/g,'');
      },
      provingprice(){
        this.formItem.price=this.formItem.price.toString().replace(/[^\.\d]/g,'');
      },
    submit() {
      this.$refs["myForm"].validate((valid) => {
        if(valid){
          this.addLoading = true
          this.formItem.imgs = this.imgsList;
          this.formItem.model = this.modelList ? this.modelList : [];
          this.formItem.community = this.communityList ? this.communityList : [];
          this.formItem.week = this.week
          this.formItem.lng = this.marker.position[0],
          this.formItem.lat = this.marker.position[1];
          
          axios.post(resourse, this.formItem).then(response => {
            
              this.addLoading = false
              let res = response.data;
              if (res.code === 200) {
                this.$Message.success("添加成功");
                this.cancel();
                this.$router.push({
                  'path':'/house/main'
                })
              } else {
                if (res.code === 403) {
                  this.$store.commit("logout", this);
                  this.$router.push({
                    name: "login"
                  });
                } else {
                  this.$Message.error(res.msg);
                }
              }
          })
        }
      })
    },
    selected(e) {
      let str = "";
      e.forEach(item => {
        str += item.name;
      });

      let geo = new AMap.Geocoder({
        city: "全国"
      });
      geo.getLocation(str, (status, result) => {
        if (status === "complete" && result.info === "OK") {
          let res = result.geocodes[0].location;
          this.center = [res.lng, res.lat];
        }
      });
    },
    handleView(url) {
      this.img = url;
      this.visibleImg = true;
    },
    handleRemove(file) {
      axios.delete("images/" + file.name).then(response => {
        let res = response.data;
        if (res.code === 200) {
          const fileList = this.$refs.upload.fileList;
          this.$refs.upload.fileList.splice(fileList.indexOf(file), 1);
        }
      });
    },
    handleSuccess(res, file) {
      // console.log(res)
      if (res.code === 200) {
        // file.url = res.data.url;
        // file.name = res.data.name;
        this.imgsList.push({ name: res.data.name, url: res.data.url });
      } else {
        this.$Message.error(res.msg);
      }
    },
    handleModelSuccess(res, file) {
      if (res.code === 200) {
        // file.url = res.data.url;
        // file.name = res.data.name;
        this.modelList.push({ name: res.data.name, url: res.data.url });
      } else {
        this.$Message.error(res.msg);
      }
    },
    handlecommunitySuccess(res, file) {
      if (res.code === 200) {
        // file.url = res.data.url;
        // file.name = res.data.name;
        this.communityList.push({ name: res.data.name, url: res.data.url });
      } else {
        this.$Message.error(res.msg);
      }
    },
    handleFormatError(file) {
      this.$Notice.warning({
        title: "The file format is incorrect",
        desc:
          "File format of " +
          file.name +
          " is incorrect, please select jpg or png."
      });
    },
    handleMaxSize(file) {
      this.$Notice.warning({
        title: "Exceeding file size limit",
        desc: "File  " + file.name + " is too large, no more than 2M."
      });
    },
    search() {
      this.getList();
    },
    handleBeforeUpload() {
      const check = this.formItem.imgs.length < 5;
      if (!check) {
        this.$Notice.warning({
          title: "Up to five pictures can be uploaded."
        });
      }
      return check;
    },
    success(res, file) {
      if (res.code === 200) {
        this.formItem.cover = res.data.url;
      }
    },
    remoteMethod() {
      // console.log(this.formItem.street);

      if (this.formItem.street !== "") {
        this.streetLoading = true;
        let city = "全国";
        let query = this.formItem.street;
        if (this.formItem.city[1] != undefined) {
          city =
            this.formItem.city[1].name == "市辖区"
              ? this.formItem.city[0].name
              : this.formItem.city[1].name;
          query =
            this.formItem.city[0].name +
            city +
            this.formItem.city[2].name +
            this.formItem.street;
        } else {
          this.$Message.error("请选择省市区");
          this.formItem.street = "";
          return;
        }
        let autoComplete = new AMap.Autocomplete({
          city: city
        });
        // let query = this.formItem.city[0].name+city+this.formItem.city[2].name+this.formItem.street
        autoComplete.search(query, (status, result) => {
          if (status === "complete" && result.info === "OK") {
            this.streetLoading = false;
            // this.streets = result.tips;
            this.streets = [];

            result.tips.forEach(item => {
              if (typeof item.address == "string") {
                this.streets.push(item);
                // console.log(item);
              }
            });
            // this.center = [res.lng, res.lat];
          }
        });
      } else {
        this.streets = [];
      }
    },
    changeList(value) {
      if (value == false) {
        setTimeout(() => {
          this.listShow = value;
        }, 150);
      } else this.listShow = value;
    },
    changeItem(item){
      this.formItem.street = item.address
      
      this.marker.position = [item.location.lng,item.location.lat]
      // this.formItem.lat = this.marker.position[1]
      this.center =[item.location.lng,item.location.lat]
    },
    handleRemoveCommunity(index){
      this.communityList.splice(index,1)
    },
    handleRemoveImgs(index){
      this.imgsList.splice(index,1)
    },
    handleRemoveModel(index){
      this.modelList.splice(index,1)
    },
    cancel(){
      this.formItem.id=0
        this.formItem.area= "",
        this.formItem.contact= "",
        this.formItem.finish= 1,
        this.formItem.title= "",
        this.formItem.orientation= 1,
        this.formItem.phone= "",
        this.formItem.price= 0,
        this.formItem.rent_type= 1,
        this.formItem.street= "",
        // this.formItem.type= {
          this.formItem.type.attr1=0,
          this.formItem.type.attr2=0,
          this.formItem.type.attr3=0,
          this.formItem.type.attr4=0
        // },
        this.formItem.imgs= [],
        this.formItem.city= [],
        this.formItem.cover= "",
        this.formItem.post_type= 0,
        this.formItem.allocation= [],
        this.formItem.floors= 0,
        this.formItem.floor= 0,
        this.formItem.week=0,
        this.formItem.city = [],
        this.formItem.remark = ''
      // },
    }
  }
};
</script>